<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>时钟</title>
    <link type="text/css" href="shizhong.css" rel="stylesheet" />
  </head>

  <body>
    <div id="clock">
      <p id="date" class="date"></p>
      <p id="time" class="time"></p>
      <p class="text">数字时钟</p>
    </div>

    <script src="../jquery/jquery-3.6.1.js"></script>
    <script>
      var week = [
        "星期日",
        "星期一",
        "星期二",
        "星期三",
        "星期四",
        "星期五",
        "星期六",
      ];
      var timerID = setInterval(updateTime, 1000); // 每隔1秒执行一次

      updateTime();

      function updateTime() {
        var cd = new Date();
        $("#time").html(
          zeroPadding(cd.getHours(), 2) +
            ":" +
            zeroPadding(cd.getMinutes(), 2) +
            ":" +
            zeroPadding(cd.getSeconds(), 2)
        );
        // document.getElementById("time").innerHTML =
        //   zeroPadding(cd.getHours(), 2) +
        //   ":" +
        //   zeroPadding(cd.getMinutes(), 2) +
        //   ":" +
        //   zeroPadding(cd.getSeconds(), 2);
        $("#date").html(
          zeroPadding(cd.getFullYear(), 4) +
            "-" +
            zeroPadding(cd.getMonth() + 1, 2) +
            "-" +
            zeroPadding(cd.getDate(), 2) +
            " " +
            week[cd.getDay()]
        );
        // document.getElementById("date").innerHTML =
        //   zeroPadding(cd.getFullYear(), 4) +
        //   "-" +
        //   zeroPadding(cd.getMonth() + 1, 2) +
        //   "-" +
        //   zeroPadding(cd.getDate(), 2) +
        //   " " +
        //   week[cd.getDay()];
      }

      function zeroPadding(num, digit) {
        var zero = "";
        for (var i = 0; i < digit; i++) {
          zero += "0";
        }
        return (zero + num).slice(-digit);
      }
    </script>
  </body>
</html>
